<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>Hyde-Y  &middot; sitename</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1">


<meta name="description" content="Enhanced port of the Jekyll &#34;Hyde&#34; theme to Hugo." />

<meta name="keywords" content="hugo, theme, hyde-y, ">


<meta property="og:title" content="Hyde-Y  &middot; sitename ">
<meta property="og:site_name" content="sitename"/>
<meta property="og:url" content="https://lvzongcheng.gitee.io/hyde-y/" />
<meta property="og:locale" content="en-EN">


<meta property="og:type" content="article" />
<meta property="og:description" content="Enhanced port of the Jekyll &#34;Hyde&#34; theme to Hugo."/>
<meta property="og:article:published_time" content="2015-09-13T15:08:27&#43;02:00" />
<meta property="og:article:modified_time" content="2015-09-13T15:08:27&#43;02:00" />

  
    
<meta property="og:article:tag" content="hugo">
    
<meta property="og:article:tag" content="theme">
    
<meta property="og:article:tag" content="hyde-y">
    
  

  

<script type="application/ld+json">
  {
    "@context": "http://schema.org",
    "@type": "Article",
    "headline": "Hyde-Y",
    "author": {
      "@type": "Person",
      "name": "LvZongCheng"
    },
    "datePublished": "2015-09-13",
    "description": "Enhanced port of the Jekyll \x22Hyde\x22 theme to Hugo.",
    "wordCount":  789 
  }
</script>



<link rel="canonical" href="https://lvzongcheng.gitee.io/hyde-y/" />

<link rel="apple-touch-icon-precomposed" sizes="144x144" href="https://lvzongcheng.gitee.io/touch-icon-144-precomposed.png">
<link href="https://lvzongcheng.gitee.io/favicon.png" rel="icon">

<meta name="generator" content="Hugo 0.60.0" />

  <!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->

<link href='https://fonts.googleapis.com/css?family=Merriweather:300%7CRaleway%7COpen+Sans' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="/css/font-awesome.min.css">
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/css/highlight/default.css">

  
  
	<script>
	  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
	  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
	  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
	  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

	  ga('create', 'Your Google Analytics tracking code', 'auto');
	  ga('send', 'pageview');

	</script>

</head>
<body>
  <main id="main-wrapper" class="container main_wrapper has-sidebar">
    <header id="main-header" class="container main_header">
  <div class="container brand">
  <div class="container title h1-like">
  <a class="baselink" href="https://lvzongcheng.gitee.io">
  LvZongCheng

</a>

</div>

  
<div class="container topline">
  
  淡定 执著 进取 自律


</div>


</div>

  <nav class="container nav primary no-print">
  

<a class="homelink" href="https://lvzongcheng.gitee.io">home</a>


  
<a href="https://lvzongcheng.gitee.io/framework" title="Show list of Frameworks">Frameworks</a>

<a href="https://lvzongcheng.gitee.io/java" title="Show list of Java">Java</a>

<a href="https://lvzongcheng.gitee.io/linux" title="Show list of Linux">Linux</a>

<a href="https://lvzongcheng.gitee.io/redis" title="Show list of Redis">Redis</a>

<a href="https://lvzongcheng.gitee.io/sql" title="Show list of SQL">SQL</a>

<a href="https://lvzongcheng.gitee.io/Spring" title="Show list of Spring">Spring</a>

<a href="https://lvzongcheng.gitee.io/tools" title="Show list of Tools">Tools</a>

<a href="https://lvzongcheng.gitee.io/webpage" title="Show list of WebPage">WebPage</a>

<a href="https://lvzongcheng.gitee.io/information" title="Show list of information">information</a>

<a href="https://lvzongcheng.gitee.io/network" title="Show list of network">network</a>

<a href="https://lvzongcheng.gitee.io/%E5%BE%AE%E6%9C%8D%E5%8A%A1" title="Show list of 微服务">微服务</a>

<a href="https://lvzongcheng.gitee.io/%E6%80%BB%E7%BB%93" title="Show list of 总结">总结</a>

<a href="https://lvzongcheng.gitee.io/%E6%9C%BA%E5%99%A8%E8%87%AA%E5%8A%A8%E5%8C%96" title="Show list of 机器自动化">机器自动化</a>

<a href="https://lvzongcheng.gitee.io/%E6%B1%87%E7%BC%96" title="Show list of 汇编">汇编</a>

<a href="https://lvzongcheng.gitee.io/%E8%AE%B0%E4%BA%8B%E6%9C%AC" title="Show list of 记事本">记事本</a>


</nav>

<div class="container nav secondary no-print">
  
<a id="contact-link-email" class="contact_link" rel="me" aria-label="Email" href="mailto:Lyc19880405@163.com">
  <span class="fa fa-envelope-square"></span></a>



<a id="contact-link-github" class="contact_link" rel="me" aria-label="Github" href="https://github.com/enten/hugo-boilerplate">
  <span class="fa fa-github-square"></span></a>




 


















</div>


  

</header>


<article id="main-content" class="container main_content single">
  <header class="container hat">
  <h1>Hyde-Y
</h1>

  <div class="badges">
  

</div>

  








  





<a class="ribbon git upright" href="https://github.com/enten/hyde-y">
  <img
    src="https://camo.githubusercontent.com/e7bbb0521b397edbd5fe43e7f760759336b5e05f/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f677265656e5f3030373230302e706e67"
    alt="Fork me on GitHub">
</a>




</header>

  <div class="container content">
  <p><!-- raw HTML omitted -->Forked from <a href="https://github.com/zyro/hyde-x">Hyde-X</a><!-- raw HTML omitted --></p>
<p>You can find a live site using this theme <a href="http://enten.github.io/hugo-boilerplate/">here</a>
and the corresponding source code <a href="https://github.com/enten/hugo-boilerplate">here</a>.</p>
<h2 id="screenshot">Screenshot</h2>
<p><img src="https://raw.githubusercontent.com/enten/hugo-boilerplate/master/themes/hyde-y/images/screenshot.png" alt="preview"></p>
<h2 id="installation">Installation</h2>
<pre><code>$ cd your_site_repo/
$ mkdir themes
$ cd themes
$ git clone https://github.com/enten/hyde-y
</code></pre><p>See the <a href="http://gohugo.io/themes/installing">official Hugo themes documentation</a> for more info.</p>
<h2 id="usage">Usage</h2>
<p>This theme expects a relatively standard Hugo blog/personal site layout:</p>
<pre><code>.
└── content
    ├── post
    |   ├── post1.md
    |   └── post2.md
    ├── code
    |   ├── project1.md
    |   ├── project2.md
    ├── license.md        // this is used in the sidebar footer link
    └── other_page.md
</code></pre><p>Just run <code>hugo --theme=hyde-y</code> to generate your site!</p>
<h2 id="configuration">Configuration</h2>
<h3 id="hugo">Hugo</h3>
<p>An example of what your site's <code>config.toml</code> could look like. All theme-specific parameters are under <code>[params]</code> and standard Hugo parameters are used where possible.</p>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-toml" data-lang="toml"><span style="color:#75715e"># hostname (and path) to the root eg. http://spf13.com/</span>
<span style="color:#a6e22e">baseurl</span> = <span style="color:#e6db74">&#34;http://www.example.com&#34;</span>

<span style="color:#75715e"># Site title</span>
<span style="color:#a6e22e">title</span> = <span style="color:#e6db74">&#34;sitename&#34;</span>

<span style="color:#75715e"># Copyright</span>
<span style="color:#a6e22e">copyright</span> = <span style="color:#e6db74">&#34;(c) 2015 lvzongcheng.&#34;</span>

<span style="color:#75715e"># Language</span>
<span style="color:#a6e22e">languageCode</span> = <span style="color:#e6db74">&#34;en-EN&#34;</span>

<span style="color:#75715e"># Metadata format</span>
<span style="color:#75715e"># &#34;yaml&#34;, &#34;toml&#34;, &#34;json&#34;</span>
<span style="color:#a6e22e">metaDataFormat</span> = <span style="color:#e6db74">&#34;yaml&#34;</span>

<span style="color:#75715e"># Theme to use (located in /themes/THEMENAME/)</span>
<span style="color:#a6e22e">theme</span> = <span style="color:#e6db74">&#34;hyde-y&#34;</span>

<span style="color:#75715e"># Pagination</span>
<span style="color:#a6e22e">paginate</span> = <span style="color:#ae81ff">10</span>
<span style="color:#a6e22e">paginatePath</span> = <span style="color:#e6db74">&#34;page&#34;</span>

<span style="color:#75715e"># Enable Disqus integration</span>
<span style="color:#a6e22e">disqusShortname</span> = <span style="color:#e6db74">&#34;your_disqus_shortname&#34;</span>

[<span style="color:#a6e22e">permalinks</span>]
    <span style="color:#a6e22e">post</span> = <span style="color:#e6db74">&#34;/:year/:month/:day/:slug/&#34;</span>
    <span style="color:#a6e22e">code</span> = <span style="color:#e6db74">&#34;/:slug/&#34;</span>

[<span style="color:#a6e22e">taxonomies</span>]
    <span style="color:#a6e22e">tag</span> = <span style="color:#e6db74">&#34;tags&#34;</span>
    <span style="color:#a6e22e">topic</span> = <span style="color:#e6db74">&#34;topics&#34;</span>

[<span style="color:#a6e22e">author</span>]
    <span style="color:#a6e22e">name</span> = <span style="color:#e6db74">&#34;lvzongcheng&#34;</span>
    <span style="color:#a6e22e">email</span> = <span style="color:#e6db74">&#34;yourname@example.com&#34;</span>

<span style="color:#75715e">#</span>
<span style="color:#75715e"># All parameters below here are optional and can be mixed and matched.</span>
<span style="color:#75715e">#</span>
[<span style="color:#a6e22e">params</span>]
    <span style="color:#75715e"># You can use markdown here.</span>
    <span style="color:#a6e22e">brand</span> = <span style="color:#e6db74">&#34;foobar&#34;</span>
    <span style="color:#a6e22e">topline</span> = <span style="color:#e6db74">&#34;few words about your site&#34;</span>
    <span style="color:#a6e22e">footline</span> = <span style="color:#e6db74">&#34;code with &lt;i class=&#39;fa fa-heart&#39;&gt;&lt;/i&gt;&#34;</span>

    <span style="color:#75715e"># Sidebar position</span>
    <span style="color:#75715e"># false, true, &#34;left&#34;, &#34;right&#34;</span>
    <span style="color:#a6e22e">sidebar</span> = <span style="color:#e6db74">&#34;left&#34;</span>

    <span style="color:#75715e"># Text for the top menu link, which goes the root URL for the site.</span>
    <span style="color:#75715e"># Default (if omitted) is &#34;Home&#34;.</span>
    <span style="color:#a6e22e">home</span> = <span style="color:#e6db74">&#34;home&#34;</span>

    <span style="color:#75715e"># Select a syntax highight.</span>
    <span style="color:#75715e"># Check the static/css/highlight directory for options.</span>
    <span style="color:#a6e22e">highlight</span> = <span style="color:#e6db74">&#34;default&#34;</span>

    <span style="color:#75715e"># Google Analytics.</span>
    <span style="color:#a6e22e">googleAnalytics</span> = <span style="color:#e6db74">&#34;Your Google Analytics tracking code&#34;</span>

    <span style="color:#75715e"># Sidebar social links.</span>
    <span style="color:#a6e22e">github</span> = <span style="color:#e6db74">&#34;enten/hugo-boilerplate&#34;</span> <span style="color:#75715e"># Your Github profile ID</span>
    <span style="color:#a6e22e">bitbucket</span> = <span style="color:#e6db74">&#34;&#34;</span> <span style="color:#75715e"># Your Bitbucket profile ID</span>
    <span style="color:#a6e22e">linkedin</span> = <span style="color:#e6db74">&#34;&#34;</span> <span style="color:#75715e"># Your LinkedIn profile ID (from public URL)</span>
    <span style="color:#a6e22e">googleplus</span> = <span style="color:#e6db74">&#34;&#34;</span> <span style="color:#75715e"># Your Google+ profile ID</span>
    <span style="color:#a6e22e">facebook</span> = <span style="color:#e6db74">&#34;&#34;</span> <span style="color:#75715e"># Your Facebook profile ID</span>
    <span style="color:#a6e22e">twitter</span> = <span style="color:#e6db74">&#34;&#34;</span> <span style="color:#75715e"># Your Twitter profile ID</span>
    <span style="color:#a6e22e">youtube</span> = <span style="color:#e6db74">&#34;&#34;</span>  <span style="color:#75715e"># Your Youtube channel ID</span>
    <span style="color:#a6e22e">flattr</span> = <span style="color:#e6db74">&#34;&#34;</span>  <span style="color:#75715e"># populate with your flattr uid</span>

[<span style="color:#a6e22e">blackfriday</span>]
    <span style="color:#a6e22e">angledQuotes</span> = <span style="color:#66d9ef">true</span>
    <span style="color:#a6e22e">fractions</span> = <span style="color:#66d9ef">false</span>
    <span style="color:#a6e22e">hrefTargetBlank</span> = <span style="color:#66d9ef">false</span>
    <span style="color:#a6e22e">latexDashes</span> = <span style="color:#66d9ef">true</span>
    <span style="color:#a6e22e">plainIdAnchors</span> = <span style="color:#66d9ef">true</span>
    <span style="color:#a6e22e">extensions</span> = []
    <span style="color:#a6e22e">extensionmask</span> = []

</code></pre></div><h3 id="menu">Menu</h3>
<p>Create <code>data/Menu.toml</code> to configure the sidebar navigation links. Example below.</p>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-toml" data-lang="toml">[<span style="color:#a6e22e">about</span>]
    <span style="color:#a6e22e">Name</span> = <span style="color:#e6db74">&#34;About&#34;</span>
    <span style="color:#a6e22e">URL</span> = <span style="color:#e6db74">&#34;/about&#34;</span>

[<span style="color:#a6e22e">posts</span>]
    <span style="color:#a6e22e">Name</span> = <span style="color:#e6db74">&#34;Posts&#34;</span>
    <span style="color:#a6e22e">Title</span> = <span style="color:#e6db74">&#34;Show list of posts&#34;</span>
    <span style="color:#a6e22e">URL</span> = <span style="color:#e6db74">&#34;/post&#34;</span>

[<span style="color:#a6e22e">tags</span>]
    <span style="color:#a6e22e">Name</span> = <span style="color:#e6db74">&#34;Tags&#34;</span>
    <span style="color:#a6e22e">Title</span> = <span style="color:#e6db74">&#34;Show list of tags&#34;</span>
    <span style="color:#a6e22e">URL</span> = <span style="color:#e6db74">&#34;/tags&#34;</span>
</code></pre></div><h3 id="foot-menu">Foot menu</h3>
<p>Create <code>data/FootMenu.toml</code> to configure the footer navigation links. Example below.</p>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-toml" data-lang="toml">[<span style="color:#a6e22e">license</span>]
    <span style="color:#a6e22e">Name</span> = <span style="color:#e6db74">&#34;license&#34;</span>
    <span style="color:#a6e22e">URL</span> = <span style="color:#e6db74">&#34;/license&#34;</span>
</code></pre></div><h2 id="builtin-colour-themes">Built-in colour themes</h2>
<p>You can rebuild the stylesheet. To do it you need <a href="http://npmjs.com/">npm</a> and run the task <code>build:css</code>.</p>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-bash" data-lang="bash">$ vi scss/_00-config.less
<span style="color:#75715e"># edit configuration</span>

$ npm install
$ npm run build:css

&gt; hyde-y@0.0.4 build:css /home/steven/code/hyde-y
&gt; grunt build:css

Running <span style="color:#e6db74">&#34;less:development&#34;</span> <span style="color:#f92672">(</span>less<span style="color:#f92672">)</span> task
File static/css/style.css created

Running <span style="color:#e6db74">&#34;cssmin:target&#34;</span> <span style="color:#f92672">(</span>cssmin<span style="color:#f92672">)</span> task
&gt;&gt; <span style="color:#ae81ff">1</span> file created. 27.04 kB → 14.38 kB

Done, without errors.
</code></pre></div><p>The task <code>watch</code> allows to rebuild the stylesheet when a change is spotted on <code>scss/*.less</code> files.</p>
<h2 id="tips">Tips</h2>
<ul>
<li>If you've added <code>theme = &quot;hyde-y&quot;</code> to your <code>config.toml</code>, you don't need to keep using the <code>--theme=hyde-y</code> flag!</li>
<li>Although all of the syntax highlight CSS files under the theme's <code>static/css/highlight</code> are bundled with the site, only the one you choose will be included in the page and delivered to the browser.</li>
<li>Change the favicon by providing your own as <code>static/favicon.png</code> (and <code>static/touch-icon-144-precomposed.png</code> for Apple devices) in your site directory.</li>
<li>Hugo makes it easy to override theme layout and behaviour, read about it <a href="http://gohugo.io/themes/customizing">here</a>.</li>
<li>Pagination is set to 10 items by default, change it by updating <code>paginate = 10</code> in your <code>config.toml</code>.</li>
</ul>
<h2 id="changes-and-enhancements-from-the-original-theme">Changes and enhancements from the original theme</h2>
<ul>
<li>Highly customizable: every layout blocks are pieces of HTML code individually stored.</li>
<li>Consistent hierarchy for the partials and templates files to assist the overrides of any layout block.</li>
<li>Adjustable sidebar in config file.</li>
<li>Project layout (badges, github ribbon) for posts stored in <code>content/code/</code> folder.</li>
<li>CSS built with <a href="http://knacss.com/">KNACSS</a> micro-framework.</li>
<li>Client-side syntax highlighting through <a href="https://highlightjs.org/">highlight.js</a>, sane fallback if disabled or no JS - infinitely more flexible than the standard Hugo highlighting.</li>
<li>Disqus integration: comment counts listed under blog entry names in post list, comments displayed at the bottom of each post.</li>
<li>Google Analytics integration.</li>
<li>Google Authorship metadata.</li>
<li>Paginated blog listing.</li>
<li><a href="http://fortawesome.github.io/Font-Awesome">FontAwesome</a> social links.</li>
<li>&hellip;many other small layout tweaks!</li>
</ul>
<h2 id="attribution">Attribution</h2>
<p>Obviously largely a port of the awesome <a href="https://github.com/poole/hyde">Hyde</a> and <a href="https://github.com/zyro/hyde-x">Hyde-X</a> themes.</p>
<h2 id="questions-ideas-bugs-pull-requests">Questions, ideas, bugs, pull requests?</h2>
<p>All feedback is welcome! Head over to the <a href="https://github.com/enten/hyde-y/issues">issue tracker</a>.</p>
<h2 id="license">License</h2>
<p>Open sourced under the <a href="https://github.com/enten/hyde-y/blob/master/LICENSE">MIT license</a>.</p>

</div>


  
</article>
      <footer id="main-footer" class="container main_footer">
  

  <div class="container nav foot no-print">
  
<a href="https://lvzongcheng.gitee.io/license">license</a>


  <a class="toplink" href="#">back to top</a>

</div>

  <div class="container credits">
  
<div class="container footline">
  
  code with <!-- raw HTML omitted --><!-- raw HTML omitted -->


</div>


  
<div class="container copyright">
  
  (c) 2015 yourname.


</div>


</div>

</footer>

    </main>
    
<script type="text/javascript">
  (function() {
    
    
    if (window.location.hostname == "localhost")
      return;
    var dsq = document.createElement('script'); dsq.async = true; dsq.type = 'text/javascript';
    dsq.src = '//your_disqus_shortname.disqus.com/count.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  })();
</script>



<script src="/js/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>



    
  </body>
</html>

